@charset "utf-8";
@import "./variable";
@import './common/main.scss';

/* 菜单背景色 */

@mixin menuContainerBackGround() {
    //默认样式
    background: $menuNightBackGround;
    color: $menuNightFontColor;
    .active-item {
        color: $menuNightActiveFontColor;
        background: $menunNightActiveBackGround;
    }
    .active-item::before {
        background: $menuActiveBeforBackGround;
    }
    [theme-style="day"] & {
        background: $menuDayBackGround;
        color: $menuDayFontColor;
        .active-item {
            color: $menuDayActiveFontColor;
            background: $menunDayActiveBackGround;
        }
        .active-item::before {
            background: $menuActiveBeforBackGround;
        }
    }
    [theme-style='night'] & {
        background: $menuNightBackGround;
        color: $menuNightFontColor;
        .active-item {
            color: $menuNightActiveFontColor;
            background: $menunNightActiveBackGround;
        }
        .active-item::before {
            background: $menuActiveBeforBackGround;
        }
    }
}

@mixin listContainerStyle() {
    background: $listNightBackGround;
    .divider {
        background: $listNightDividerColor;
    }
    .list-active {
        background-color: $listNightActiveGround
    }
    .list-hover {
        background: $listNightHoverBackgroud;
    }
    .header-icon {
        background: $listNightIconBackground;
    }
    [theme-style="day"] & {
        background: $listDayBackGroun;
        .list-active {
            background-color: $listDayActiveGround
        }
        .divider {
            background: $listDayDividerColor;
        }
        .list-hover {
            background: $listDayHoverBackgroud;
        }
        .header-icon {
            background: $listDayIconBackground;
        }
    }
    [theme-style='night'] & {
        background: $listNightBackGround;
        .list-active {
            background-color: $listNightActiveGround
        }
        .divider {
            background: $listNightDividerColor;
        }
        .list-hover {
            background: $listNightHoverBackgroud;
        }
        .header-icon {
            background: $listNightIconBackground;
        }
    }
}